<!--  -->
<template>
  <div>
        <Card>
            <div slot="title" v-if="user_type!='01'">
                <Button v-if="btnp.ywryuan_xzywry" @click="handleClickAddForm" class="zh-hollow" type="primary" icon="plus-round">新增运维人员</Button>
                <Button v-if="btnp.ywryuan_plxz" @click="modal_batch=true" style="marginLeft:25px;" class="zh-hollow" type="warning" >批量新增</Button>
            </div>
            <Form :model="formItem" :label-width="70">
                <Row :gutter="10" type="flex"  align="middle"  >
                    <Col span="8">
                        <FormItem label="运维人员">
                            <Input v-model="formItem.name" placeholder="姓名/手机号" clearable></Input>
                        </FormItem>
                    </Col>
                    <Col span="8" v-if="user_type!='02'">
                        <FormItem label="服务商">
                            <Select v-model="formItem.serviceUuid" filterable @on-change="searchServiceChange">
                                <Option  v-for="item in moreServiceList" :value="item.uuid" :key="item.uuid">{{ item.name }}</Option>
                            </Select>
                        </FormItem>
                    </Col>
                    <Col span="8">
                        <FormItem label="部门">
                            <Select v-if="user_type=='02'" v-model="formItem.deptUuid" filterable>
                                <Option  v-for="item in morePartList" :value="item.uuid" :key="item.uuid">{{ item.name }}</Option>
                            </Select>
                            <Select v-else v-model="formItem.deptUuid" filterable :disabled="formItem.serviceUuid==''?true:false">
                                <Option  v-for="item in morePartList" :value="item.uuid" :key="item.uuid">{{ item.name }}</Option>
                            </Select>
                        </FormItem>
                    </Col>
                    <!-- <Col span="8">
                        <FormItem label="工作状态">
                            <Select v-model="formItem.isBusy" >
                                <Option  v-for="item in stateList" :value="item.value" :key="item.value">{{ item.label }}</Option>
                            </Select>
                        </FormItem>
                    </Col> -->
                    <Col span="8"  v-if="user_type!='01'">
                        <FormItem label="服务客户">
                            <Select v-model="formItem.customerUuid" filterable>
                                <Option  v-for="item in customerList" :value="item.uuid" :key="item.uuid">{{ item.name }}</Option>
                            </Select>
                        </FormItem>
                    </Col>
                    <Col span="8">
                        <FormItem label="账号状态">
                            <Select v-model="formItem.qstate" >
                                <Option  v-for="item in astateList" :value="item.value" :key="item.value">{{ item.label }}</Option>
                            </Select>
                        </FormItem>
                    </Col>
                    <Col span="12">
                        <FormItem label="新增时间">
                            <DatePicker v-model="search.timeRange" format="yyyy-MM-dd HH:mm" type="datetimerange" placement="bottom-end" placeholder="请选择开始和结束时间"></DatePicker>
                        </FormItem>
                    </Col>
                <!-- </Row>
                <Row> -->
                    <Col span="12"  >
                        <FormItem label="所在地">
                            <Cascader change-on-select v-model="search.location" placeholder="请选择省市区" :data="areasData" ></Cascader>
                        </FormItem>
                    </Col>
                </Row>
                <Row  >
                <Col span="8" offset="16"  style="text-align:right;">
                    <Button @click="handleClickgetTable" class="zh-hollow" type="primary" icon="ios-search-strong">搜索</Button>
                    <!-- <Button v-if="btnp.ywryuan_dc" class="zh-hollow" type="warning" style="margin-left:25px;">导出EXCEL</Button> -->
                    <a style="margin-left:25px;" v-if="btnp.ywryuan_dc" :href="downLoadUrl" target="_blank"><Button  class="zh-hollow" type="warning"  > 导出EXCEL </Button></a>
                </Col>
                
                </Row>
            </Form>
        </Card>
        <Card style="margin-top:10px;" :padding="0">
            <Table :loading="loading" border :columns="columns" :data="data"></Table>
            <Page :current.sync="formItem.pageNumber"  :total="total" show-total show-sizer @on-change="pageChange" @on-page-size-change="pageSizeChange"></Page>
        </Card>
        <Modal v-model="modal_batch" title="批量新增" :mask-closable="false" class-name="vertical-center-modal">
            <div style="padding:15px 30px;">
                <p>从本地选择Excel格式的人员列表，批量导入人员。</p>
                <a :href="url_ywrTempDc" ><Button type="text" style="color:#2d8cf0" >下载Excel模板</Button></a>
            </div>
            <div slot="footer" class="zh-flex zh-flex-5 excel" style="width:100%;">
                <Button @clcik="modal_batch=false;" type="ghost">放弃操作</Button>  
                <Upload 
                ref="upload"
                :with-credentials="true"
                :on-success="handleSuccessExcel"
                :on-progress="handleProgressExcel"
                :format="['xlsx','xls']"
                :on-format-error="handleFormatErrorExcel"
                :before-upload="handleBeforeUploadExcel"
                :action="dr_url_ywr">
                    <Button type="primary" :loading="btnloading" class="zh-hollow">选择文件</Button>
                </Upload>
            </div>
        </Modal>
        <Modal v-model="modal_position" title="当前位置"  class-name="vertical-center-modal" class="no_footer_modal">
            <div id="poMap" style="height:300px"></div>
        </Modal>
        <Modal v-model="modal_info" :title="infoTitle" :loading='saveLoad' @on-ok="validate"  ok-text="保存" cancel-text="放弃操作" :mask-closable="false">
            <Form :label-width="70" :model="information" style="padding:15px 30px;">
                <FormItem label="姓名*">
                    <Input v-model="information.name" :maxlength="5"></Input>
                </FormItem>
                <FormItem label="手机号*">
                    <Input v-model="information.mobile" :maxlength="11"></Input>
                </FormItem>
                <FormItem label="所在地*">
                    <Cascader change-on-select v-model="information.location" placeholder="请选择省市区" :data="areasData" ></Cascader>
                </FormItem>
                <FormItem label="服务商*" v-if="user_type!='02'">
                    <Select v-if="infoType!=='edit'" v-model="information.serviceUuid" filterable @on-change="formServiceChange">
                        <Option  v-for="item in serviceList" :value="item.uuid" :key="item.uuid">{{ item.name }}</Option>
                    </Select>
                   
                        <Input v-else v-model="information.service" readonly></Input>
                    
                </FormItem>
                <FormItem label="部门" v-if="information.serviceUuid!=''&&information.serviceUuid!=undefined">
                    <Select v-model="information.deptUuid" filterable>
                        <Option  v-for="item in partList" :value="item.uuid" :key="item.uuid">{{ item.name }}</Option>
                    </Select>
                </FormItem>
                <FormItem label="身份证号*">
                    <Input v-model="information.iDNumber  " :maxlength="18" ></Input>
                </FormItem>
                <FormItem label="免冠照">
                        <template v-if="!!information.pic.url">
                            <div class="upload-wrap" v-if="information.pic.status === 'finished'" style="width:100px;height:140px;">
                                <img :src="upLoadData.domain+information.pic.url" style="display:block;width:100px;height:140px;">
                                <div class="upload-cover" style="width:100px;height:140px;">
                                    <div class="iconBox">
                                        <Icon type="ios-eye-outline" @click.native="handleView(information.pic.url)"></Icon>
                                        <Icon type="ios-trash-outline" @click.native="handleRemove(information.pic.url)"></Icon>
                                    </div>
                                </div>
                            </div>
                            <template v-else>
                                <Progress v-if="item.showProgress" :percent="item.percentage" hide-info></Progress>
                            </template>
                        </template>
                        <Upload
                            v-else
                            ref="upload"
                            :default-file-list="defaultList"
                            :show-upload-list="false"
                            :on-success="handleSuccess"
                            :format="['jpg','jpeg','png']"
                            :max-size="2048"
                            :on-format-error="handleFormatError"
                            :on-exceeded-size="handleMaxSize"
                            :before-upload="handleBeforeUpload"
                            :data="upLoadData"
                            type="drag"
                            action=" http://upload.qiniup.com"
                            style="display: inline-block;width:100;height:140px;">
                            <div style="width:100px;height:140px;line-height: 140px;">
                                <Icon type="ios-plus-empty" :size='30'></Icon>
                            </div>
                        </Upload>                   
                </FormItem> 
                <FormItem label="服务客户" v-if="infoType!=='edit'">
                    <div @click="addEditClick" style="color:#2d8cf0;cursor:pointer;">
                        <p class='canSeeText'>{{information.customerStr}}</p>
                    </div>
                </FormItem>                                                
            </Form>
        </Modal>
        <Modal v-model="modal_info_view" title="人员信息"  class="no_footer_modal">
            <Form :label-width="70" :model="information" style="padding:15px 30px;">
                <FormItem v-if="!!information.name" label="姓名:">
                    {{information.name}}
                </FormItem>
                <FormItem v-if="!!information.mobile" label="手机号:">
                    {{information.mobile}}
                </FormItem>
                <FormItem v-if="!!information.area" label="所在地:">
                    {{information.area}}
                </FormItem>
                <FormItem v-if="user_type!='02'&&!!information.service" label="服务商:">
                    {{information.service}}
                </FormItem>
                <FormItem v-if="!!information.part" label="部门:">
                    {{information.part}}
                </FormItem>
                <FormItem v-if="!!information.iDNumber" label="身份证号:">
                    {{information.iDNumber  }}
                </FormItem>
                <FormItem v-if="!!information.pic.url" label="免冠照:">
                        <img @click="handleView(information.pic.url)" :src="upLoadData.domain+information.pic.url" alt="" style="width:100px;height:140px;">               
                </FormItem>                                                
            </Form>
        </Modal>
        <Modal title="查看免冠照" v-model="look_pic_wrap.look_pic" class="no_footer_modal">
            <div style="padding:20px 0;">
                <img style="width:80%;display:block;margin:0 auto;" :src="upLoadData.domain+look_pic_wrap.src" alt="">
            </div>
            
        </Modal>
        <Modal title="服务客户" v-model="modal_cus" class="no_footer_modal">
            <Card>
                <div slot="title" >
                    <Button @click="modal_s_cus=true" class="zh-hollow" type="primary" icon="plus-round">增加服务客户</Button>
                </div>
                <Table no-data-text="暂无服务的客户"  :columns="cusColumns" :data="cus_table"></Table>
                <Page :current.sync="conCus_pageNumber" :page-size='5' :total="conCus_total" show-total  @on-change="conCusPageChange" ></Page>
            </Card>
        </Modal>
        <Modal  title="服务客户" v-model="modal_s_cus" :mask-closable="false" class-name="vertical-center-modal">
            <div style="padding:15px 30px;">
                <Cascader @on-change='addrChange' style="marginBottom:15px;"  v-model="s_cus.location" placeholder="请选择地区" :data="twoAreaData" ></Cascader>
                
                    <Table  @on-selection-change="onselectionchange" border ref="selection" :columns="s_cus_columns" :data="s_cus.checkOptions"></Table>
                    <Page :current.sync="all_pageNumber" :total="alltotal"  :page-size='allpageSize'  @on-change="allPageChange" ></Page>
                
                
            </div>

            <div slot="footer">
                <Button @click="checkComfirm" class="zh-hollow" type="primary" >确定</Button>
            </div>
        </Modal>
        
  </div>
</template>

<script>
import {url_ywrDc,url_ywrTempDc,dr_url_ywr} from '@/libs/downLoadUrl'
import util from '@/libs/util.js'
import {getServiceAll} from '@/libs/system.js'
import {
    getQiniuToken,
    getDeptList,
    getOperatorsTable,
    getAllServiceByCustomer,
    getAllCustomerByService,
    getProInfoByProUuid,
    getConCusTable,
    getCanConCusList,
    getProPosition
} from '@/libs/get.js'
import {
    saveOneOperator,
    deleteOneOperator,
    relieveRele,
    releCus
} from '@/libs/post.js'
export default {
    name:'',
    data () {
        return {
            dr_url_ywr:dr_url_ywr,
            btnloading:false,
            url_ywrTempDc:url_ywrTempDc,
            downLoadUrl:url_ywrDc,
            allpageSize:5,
            checked:[],
            s_cus_columns:[
                {
                    type: 'selection',
                    width: 60,
                    align: 'center'
                },
                {
                    title:'可选客户',
                    key:'name' 
                }
            ],
            all_province:'',
            all_city:'',
            all_pageNumber:1,
            alltotal:0,
            allChose:0,
            serUuid:'',
            proUuid:'',
            conCus_total:0,
            conCus_pageNumber:1,
            formItem:{
                name:'',
                serviceUuid:'',
                deptUuid:'',
                isBusy:'',
                customerUuid:'',
                qstate:'',
                pageNumber:1,
                pageSize:10,
            },
            btnp:{},
            btn:{
                ywryuan_xzywry:false,
                ywryuan_plxz:false,
                ywryuan_dc:false,
                ywryuan_ryxx:false,
                ywryuan_wxjl:false,
                ywryuan_dqwz:false,
                ywryuan_fwkh:false,
                ywryuan_bj:false,
                ywryuan_sc:false,
            },
            saveLoad:true,
            user_type:'',
            userUuid:'',
            defaultList:[],
            upLoadData:{
                token:'',
                unique_names: true,
                domain:this.$store.state.app.domain
            },
            cusColumns:[
                {
                    key:'name',
                    title:'已关联的服务客户'
                },{
                    key:'action',
                    title:'操作',
                    align:'center',
                    render:(h,params)=>{
                        return h('Button',{
                            props:{
                                type:'text',
                                size:'small'
                                },
                                style:{
                                color:'#2D8CF0'
                                },
                                on:{
                                    click:()=>{
                                        this.relieve(params.row.uuid);
                                        
                                    }
                                }
                        },'解除关联')
                    }
                }
            ],
            cus_table:[],
            modal_cus:false,
            modal_info_view:false,
            s_cus:{
                checkOptions:[],
                location:['','']
            },
            modal_s_cus:false,
            infoType:'',//add,edit
            look_pic_wrap:{
                look_pic:false,
                src:''
            },
            uploadList:[],
            modal_info:false,
            infoTitle:'',
            information:{
                name:'',
                mobile:'',
                location:['','',''],
                area:'',
                service:'',
                serviceUuid:'',
                deptUuid:'',
                part:'',
                iDNumber  :'',
                pic:{
                    name:'',
                    url:'',
                    status:'',
                    showProgress:true,
                    percentage:0
                },
                partner_code:'',
                customer:[],
                customerStr:'请选择',
            },
            modal_position:false,
            loading:true,
            total:18,
            modal_batch:false,
            search:{
                location:[],
                timeRange:[]
            },
            moreServiceList:[],
            serviceList:[],
            customerList:[],
            areasData:this.$store.state.user.areaData, 
            twoAreaData:[], 
            partList :[],
            morePartList:[{uuid:'全部',name:'全部'}],
            astateList:[
                {
                    value:'全部',
                    label:'全部'
                },
                {
                    value:0,
                    label:'正常'
                },
                {
                    value:2,
                    label:'未激活'
                },
                {
                    value:4,
                    label:'已删除'
                }
            ],
            stateList:[
                {
                    label:'全部',
                    value:'全部'
                },{
                    label:'忙碌',
                    value:'y'
                },{
                    label:'空闲',
                    value:'n'
                }
            ],
            columns:[
                {
                    key:'name',
                    title:'姓名',
                    fixed:'left',
                    minWidth:100
                },
                {
                    key:'mobile',
                    title:'手机号',
                    minWidth:120
                },
                {
                    key:'area',
                    title:'所在地',
                    minWidth:200
                },
                {
                    key:'pname',
                    title:'所属服务商',
                    minWidth:150
                },

                {
                    key:'deptName',
                    title:'部门',
                    minWidth:100
                },
                {
                    key:'time',
                    title:'新增时间',
                    minWidth:150
                },
                // {
                //     key:'free_state',
                //     title:'工作状态',
                //     minWidth:100,
                //     align:'center'
                // },
                {
                    key:'state',
                    title:'账号状态',
                    minWidth:100,
                    align:'center'
                },
                {
                    key:'action',
                    title:'操作',
                    align:'center',
                    fixed:'right',
                    minWidth:this.user_type=='01'?100:200,
                    render:(h,params)=>{
                        let uuid=params.row.uuid;
                        let status=params.row.status;
                        return h('div',[
                            h('Button',{
                                props:{
                                type:'text',
                                size:'small'
                                },
                                style:{
                                color:'#2D8CF0',
                                display:status=='4'?'none':this.btnp.ywryuan_ryxx?'inline-block':'none'
                                },
                                on:{
                                    click:()=>{
                                        this.getProInfo(uuid,'view')
                                    }
                                }
                            },'人员信息'), 
                            h('Button',{
                                props:{
                                type:'text',
                                size:'small'
                                },
                                style:{
                                color:'#2D8CF0',
                                display:status=='4'?'none':this.btnp.ywryuan_wxjl?'inline-block':'none'
                                },
                                on:{
                                click:()=>{
                                   this.$router.push({name:'repaire',params:{pro_uuid:uuid}})  
                                }
                                }
                            },'维修记录'), 
                            h('Button',{
                                props:{
                                type:'text',
                                size:'small'
                                },
                                style:{
                                color:'#2D8CF0',
                                display:status=='4'?'none':this.btnp.ywryuan_dqwz?'inline-block':'none'
                                },
                                on:{
                                    click:()=>{
                                        this.getPosition(uuid);
                                                                                                                  
                                    }
                                }
                            },'当前位置'), 
                            h('Button',{
                                props:{
                                type:'text',
                                size:'small'
                                },
                                style:{
                                color:'#2D8CF0',
                                display:status=='4'?'none':this.btnp.ywryuan_fwkh?'inline-block':'none'
                                },
                                on:{
                                click:async ()=>{
                                    this.proUuid=uuid;
                                    this.serUuid=params.row.inst_uuid;
                                    this.getContactCus(uuid,this.conCus_pageNumber,5)
                                    this.modal_cus=true;
                                   
                                    
                                }
                                }
                            },'服务客户'),                                                                                                                
                            h('Button',{
                                props:{
                                type:'text',
                                size:'small'
                                },
                                style:{
                                color:'#2D8CF0',
                                display:status=='4'?'none':this.btnp.ywryuan_bj?'inline-block':'none'
                                },
                                on:{
                                click: async()=>{
                                    this.proUuid=uuid;
                                    this.infoType="edit";
                                    await this.qiniuToken();
                                    await this.getProInfo(uuid,'edit');
                                    await this.getServicePart(this.information.serviceUuid,'form');
                                    
                                }
                                }
                            },'编辑'),
                            h('Button',{
                                props:{
                                type:'text',
                                size:'small'
                                },
                                style:{
                                color:'#EA0000',
                                display:status=='4'?'none':this.btnp.ywryuan_sc?'inline-block':'none'
                                },
                                on:{
                                click:()=>{
                                    let config={
                                    title:'删除报修人',
                                    content:'删除运维人员无法恢复，但不会影响已经产生的数据。',
                                    okText:'删除',
                                    cancelText:'放弃操作',
                                    onOk:()=>{
                                        this.delete(uuid)
                                    }
                                    }
                                    this.$Modal.confirm(config)
                                }
                                }
                            },'删除')
                        ])
                    }
                }
            ]    ,
            data:[] 
        };
    },
    methods:{
        init(){
            let that=this;
            util.isCustomer(this);
            this.twoAreaData=JSON.parse(JSON.stringify(this.$store.state.user.areaData)).map(item=>{
                if(!!item.children){
                    item.children=item.children.map(child=>{
                    return {
                        value:child.value,
                        label:child.label
                    }
                })
                }
                
                return item
            })
            let timer;
			if(that.user_type=='00'){
				timer=setInterval(()=>{
					if(that.$store.state.user.customer.length>0){
						that.customerList=[{name:'全部',uuid:'全部'},...that.$store.state.user.customer];
						clearInterval(timer)	
					}
				},500);
			}
            // setTimeout(()=>{
            //     // that.areasData=that.$store.state.user.areaData;
               
            //     // that.twoAreaData=JSON.parse(JSON.stringify(that.$store.state.user.areaData)).map(item=>{
            //     //     if(!!item.children){
            //     //         item.children=item.children.map(child=>{
            //     //         return {
            //     //             value:child.value,
            //     //             label:child.label
            //     //         }
            //     //     })
            //     //     }
                    
            //     //     return item
            //     // })
            //     if(that.user_type=='00'){
            //         that.customerList=[{name:'全部',uuid:'全部'},...that.$store.state.user.customer];
            //     }
            // },5000);
            if(this.user_type=='02'){               
                this.getServicePart(this.userUuid,'search')
            } 
            this.getAllService();
        },
        handleSuccessExcel(res, file){
            if(res.code==200){
                this.$Notice.success({
                    desc:res.msg
                });
                this.modal_batch=false;
                this.getTable();
            }else{
                this.$Notice.error({
                    desc:res.msg
                })
            }
            this.btnloading=false;
        },
        handleProgressExcel(){
            this.btnloading=true;
        },
        handleBeforeUploadExcel(){

        },
        handleFormatErrorExcel (file) {
            this.$Notice.warning({
                title: '文件格式错误',
                desc: '请选择 xlsx 或 xls 格式的文件'
            });
        },
        async getPosition(uuid){
            let res=await getProPosition(uuid);
            let response=res.data;
            if(response.code===200){
                this.modal_position=true;
                setTimeout(()=>{
                        util.initMap('poMap',response.data.longitude,response.data.latitude)
                },500) 
                
            }else{
                this.$Notice.error({
                desc:response.msg
                });
            }
        },
        async addCus(uuid,partnerCode){
            let res=await releCus(uuid,partnerCode);
            let response=res.data;
            if(response.code===200){
                this.$Notice.success({
                    desc:'已关联'
                });
                this.conCus_pageNumber=1;
                this.getContactCus(uuid,this.conCus_pageNumber,5);
                this.modal_s_cus=false;
            }else{
                this.$Notice.error({
                desc:response.msg
                });
            }
        },
        async delete(uuid){
            let res=await deleteOneOperator(uuid);
            let response=res.data;
            if(response.code===200){
                this.$Notice.success({
                    desc:'已删除'
                });
                this.formItem.pageNumber=1;
                this.getTable();
            }else{
                this.$Notice.error({
                desc:response.msg
                });
            }
        },
        async relieve(uuid){
            let res=await relieveRele(uuid);
            let response=res.data;
            if(response.code===200){
                this.$Notice.success({
                    desc:'已解除关联'
                });
                this.conCus_pageNumber=1;
                this.getContactCus(this.proUuid,this.conCus_pageNumber,5)
            }else{
                this.$Notice.error({
                desc:response.msg
                });
            }
        },
        addEditClick(){
            this.modal_s_cus=true;
            this.serUuid=this.information.serviceUuid;
            this.checked=JSON.parse(JSON.stringify(this.information.customer));
        },
        onselectionchange(selection){
            let otherSelection=selection.filter(item=>{
                if(!this.checked.map(item=>{return item.partnerCode}).includes(item.partnerCode)){
                    return item
                }
            });
            this.checked=[...this.checked,...otherSelection];
            let checkeduuid=selection.map(item=>{
                return item.partnerCode
            });
            let nochecked=this.s_cus.checkOptions.filter(item=>{
                if(!checkeduuid.includes(item.partnerCode)){
                    return item
                }
            });
            let nocheckeduuids=nochecked.map(item=>{
                return item.partnerCode
            })
            this.checked=this.checked.filter(item=>{
                if(!nocheckeduuids.includes(item.partnerCode)){
                    return item
                }
            })
            
        },
        addrChange(value){
            this.all_pageNumber=1;
            this.all_province=value[0];
            this.all_city=value[1];
            this.getAllConCus(this.proUuid,this.serUuid,this.all_province,this.all_city, this.all_pageNumber,this.allpageSize);
        },
        allPageChange(number){
            this.all_pageNumber=number;
            this.getAllConCus(this.proUuid,this.serUuid,this.all_province,this.all_city,number,this.allpageSize);
        },
        async getAllConCus(uuid,serviceUuid,province,city,pageNumber,pageSize){
            let res=await getCanConCusList(uuid,serviceUuid,province,city,pageNumber,pageSize);
            let response=res.data;
            if(response.code===200){
                this.alltotal=response.data.total;
                this.s_cus.checkOptions=response.data.rows;
                
                if(this.checked.length>0){
                    let uuids=this.checked.map(item=>{
                        return item.partnerCode
                    })
                     this.s_cus.checkOptions= this.s_cus.checkOptions.map(item=>{
                         if(uuids.includes(item.partnerCode)){
                             item._checked=true;
                         }else{
                              item._checked=false;
                         }
                         return item
                     })
                }
                
            }else{
                this.$Notice.error({
                    desc:response.msg
                });
                
            }
        },
        conCusPageChange(number){
            this.conCus_pageNumber=number;
            this.getContactCus(this.proUuid,number,5);
        },
        async getContactCus(uuid,pageNumber,pageSize){
            let res=await getConCusTable(uuid,pageNumber,pageSize);
            let response=res.data;
            if(response.code===200){
                this.conCus_total=response.data.total;
                this.cus_table=response.data.rows;
                return true;
            }else{
                this.$Notice.error({
                desc:response.msg
                });
                return false
            }
        },
        async getProInfo(uuid,type){
            let res=await getProInfoByProUuid(uuid);
            let response=res.data;
            if(response.code==200){
                this.information={
                name:response.data.name,
                mobile:response.data.mobile,
                location:!!response.data.province?[response.data.province,response.data.city,response.data.district]:[],
                area:!!response.data.province?`${response.data.province} ${response.data.city} ${response.data.district}`:'',
                service:response.data.inst_name,
                serviceUuid:response.data.inst_uuid,
                deptUuid:response.data.deptUuid,
                part:this.information.deptName,
                iDNumber  :response.data.iDNumber,
                pic:{
                    name:'',
                    url:response.data.id_photo_url,
                    status:'finished',
                    showProgress:true,
                    percentage:100
                },
                partner_code:response.data.customerUuids!==null?response.data.customerUuids:'',
                customer:[],
                customerStr:response.data.customerStr!==null?response.data.customerStr:'请选择',
            };
            if(response.data.customerUuids!==null){
                let a=response.data.customerUuids.split(',');
                let b=response.data.customerStr.split(',')
                this.information.customer=a.map((item,index)=>{
                    return {
                        name:b[index],
                        partnerCode:a[index]
                    }
                })
            }
                if(type=='edit'){
                    this.modal_info=true;
                }else{
                    this.modal_info_view=true;
                }
            }else{
                this.$Notice.error({
                    desc:response.msg
                })
            }
        },
        async getCustomers(){
            let res=await getAllCustomerByService(this.userUuid);
            let response=res.data;
            if(response.data==200){
                this.customerList=[{name:'全部',uuid:'全部'},...response.data];
               
            }else{
                this.$Notice.error({
                    desc:response.msg
                })
            }
        },
        async getAllService(){
            let res;
            if(this.user_type=='00'){
                res=await getServiceAll();
            }else{
                res=await getAllServiceByCustomer(this.userUuid)
            }
            let response=res.data;
            if(response.code==200){
                this.moreServiceList=[{name:'全部',uuid:'全部'},...response.data];
                this.serviceList=response.data;
                
            }else{
                this.$Notice.error({
                    desc:response.msg
                })
            }
        },
        async getTable(){
            this.loading=true;
            let form=JSON.parse(JSON.stringify(this.formItem));
            for(let key in form){
                if(form[key]==='全部'){
                    form[key]='';
                }
            }
            if(!!this.search.timeRange[0]&&this.search.timeRange.length>0){
                form.startTime=util.time1(this.search.timeRange[0]);
                form.endTime=util.time1(this.search.timeRange[1]);
            }
            if(this.search.location.length>0&&!!this.search.location[0]){
                form.province=this.search.location[0];
                form.city=this.search.location[1];
                form.district=this.search.location[2];
            }     
            let res=await getOperatorsTable(form);
            let response=res.data;
            if(response.code===200){
                this.total=response.data.total;
                this.data=response.data.rows.map(item=>{
                    item.time=item.created.slice(0,16);
                    return item
                })
                this.loading=false;
                this.downLoadUrl=`${url_ywrDc}${util.pjArgu(form)}`;
            }else{
                this.$Notice.error({
                desc:response.msg
                });
                
            }
        },
        pageSizeChange(size){
        //回到第一页
            this.formItem.pageNumber=1;
            this.formItem.pageSize=size;
            this.getTable();
        },
        pageChange(number){
            this.formItem.pageNumber=number;
            this.getTable();
        },
        handleClickgetTable(){
            this.formItem.pageNumber=1;
            this.getTable();
        },
        formServiceChange(value){
            this.getServicePart(value,'form')
        },
        searchServiceChange(value){
            this.getServicePart(value,'search')
        },
        async getServicePart(instUuid,type){
            let res=await getDeptList(instUuid);
            let response=res.data;
            if(response.code===200){
                if(type==='search'){
                    this.morePartList=[{uuid:'全部',name:'全部'},...response.data]
                }else if(type==='form'){
                    this.partList=response.data
                }
            }else{
                this.$Notice.error({
                    desc:response.msg
                });
            } 
        },
        async save(){
            let form=JSON.parse(JSON.stringify(this.information));
            form.uuid=this.proUuid;
            form.id_photo_url=form.pic.url;
            form.province=form.location[0];
            form.city=form.location[1];
            form.district=form.location[2];
            let res=await saveOneOperator(form);
            let response=res.data;
            let text;
            if(this.infoType=="add"){
                text="新增成功，已发送激活短信"
            }else{
                text='保存成功'
            }
            if(response.code===200){
                this.$Notice.success({
                    desc:text
                });
                this.modal_info=false;
                this.getTable();
            }else{
                this.$Notice.error({
                desc:response.msg
                });
            } 
           
        },
        async validate(){
            const reg=/^[\u4e00-\u9fa5]{2,5}$/;
            const mobileReg=this.$store.state.app.mobileReg;
            if(!reg.test(this.information.name)){
                this.$Notice.error({
                    desc:'请输入真实姓名'
                });
            }else if(this.information.mobile.length<=0){
                this.$Notice.error({
                    desc:'请输入手机号'
                });
            }else if(!mobileReg.test(this.information.mobile)){
                this.$Notice.error({
                    desc:'手机号格式错误'
                });
            }else if(!this.information.location[0]){
                this.$Notice.error({
                    desc:'请选择所在地'
                });
            }else if(this.information.serviceUuid==''){
                this.$Notice.error({
                    desc:'请选择服务商'
                });
            }else if(this.information.iDNumber==''){
                this.$Notice.error({
                    desc:'请输入身份证号'
                });
                
            }else if(!util.validateIdCard(this.information.iDNumber)){
                this.$Notice.error({
                    desc:'身份证号输入有误'
                });
                
            }else{
                await this.save();
            }
             let that=this;
            this.saveLoad=false;
            setTimeout(()=>{
                that.saveLoad=true;
            },500)
        },
        async qiniuToken(){
            let res=await getQiniuToken();
            let response=res.data;
            if(response.code===200){
                this.upLoadData.token=JSON.parse(response.data).uptoken;
            }else{
                this.$Notice.error({
                    title: '请求出错',
                    desc:response.msg
                });
                return false
            }
        },
        checkComfirm(){
            if(this.modal_info){
                this.information.customer=JSON.parse(JSON.stringify(this.checked));
                this.information.partner_code=this.checked.map(item=>{
                    return item.partnerCode
                }).join(',');
                this.information.customerStr=this.checked.map(item=>{
                    return item.name
                }).join(',');
                this.modal_s_cus=false;
            }else{
                let a=this.checked.map(item=>{
                    return item.partnerCode
                }).join(',');
                if(a.length>0){
                    this.addCus(this.proUuid,a);
                }else{
                    this.modal_s_cus=false;
                }
                
            }
        },
        async handleClickAddForm(){
            this.modal_info=true;
            this.infoType="add";
            await this.qiniuToken();
        },
        handleView(img){
            this.look_pic_wrap.look_pic=true;
            this.look_pic_wrap.src=img;

        },
        handleRemove(img){
            this.uploadList=[];
            this.information.pic={
                name:'',
                url:'',
                status:'',
                showProgress:true,
                percentage:0
            }
        },
        handleSuccess (res, file) {
            this.information.pic={
                    name:file.name,
                    url:res.hash,
                    status:'finished',
                    showProgress:true,
                    percentage:100
                }
        },
        handleFormatError (file) {
            this.$Notice.warning({
                title: '图片格式错误',
                desc: '请选择 jpg 或 png 格式的图片'
            });
        },
        handleMaxSize (file) {
            this.$Notice.warning({
                title: '图片过大',
                desc: '请选择文件大小小于2M的图片'
            });
        },
        handleBeforeUpload () {
            const check = this.uploadList.length < 2;
            if (!check) {
                this.$Notice.warning({
                    title: '一次只能上传一张'
                });
            }else{
                this.information.pic=this.uploadList[0]
            }
            return check;
        },
    },
    created(){
        this.btnp=util.bpower(this,this.btn);
        this.init();
        this.getTable();
        
    },
    watch:{
        modal_s_cus:function(){
            if(!this.modal_s_cus){
                this.s_cus={
                    checkOptions:[],
                    location:['','']
                };
                this.all_province='';
                this.all_city='';
                this.checked=[];
            }else{
                this.all_pageNumber=1;
                this.getAllConCus(this.proUuid,this.serUuid,this.all_province,this.all_city,this.all_pageNumber,this.allpageSize);
            }
        },
        modal_cus:function(){
            if(!this.modal_cus){
                this.conCus_pageNumber=1;
                this.proUuid='';
                this.serUuid='';
            }
        },
        infoType:function(){
            this.infoTitle=this.infoType==="edit"?'编辑人员信息':'新增人员'
        },
        modal_info_view:function(){
            if(!this.modal_info_view){
                this.serUuid='';
                this.information={
                    name:'',
                    mobile:'',
                    location:[],
                    area:'',
                    service:'',
                    serviceUuid:'',
                    deptUuid:'',
                    part:'',
                    iDNumber  :'',
                    pic:{
                        name:'',
                        url:'',
                        status:'',
                        showProgress:true,
                        percentage:0
                    },
                    partner_code:'',
                    customer:[],
                    customerStr:'请选择',
                }
            }
        },
        modal_info:function(){
            if(!this.modal_info){
                this.information={
                    name:'',
                    mobile:'',
                    location:['','',''],
                    area:'',
                    service:'',
                    serviceUuid:'',
                    deptUuid:'',
                    part:'',
                    iDNumber:'',
                    pic:{
                        name:'',
                        url:'',
                        status:'',
                        showProgress:true,
                        percentage:0
                    },
                    partner_code:'',
                    customer:[],
                    customerStr:'请选择',
                }
            }
        }
    }
    


}

</script>
<style lang='scss' >
.upload-wrap{
    text-align:center;
    position: relative;
    box-shadow: 0 1px 1px rgba(0,0,0,.2);
    width:100px;
    height:140px;
}
.iconBox{
    display:inline-block;
    position:absolute;
    top:50%;
    left:50%;
   transform: translateX(-50%) translateY(-50%);

}
.upload-cover{
    width:100px;
    height:140px;
    display: none;
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    background: rgba(0,0,0,.6);
    i{
        color: #fff;
        font-size: 30px;
        cursor: pointer;
        margin: 0 10px;
    }
}
.upload-wrap:hover .upload-cover{
    display: block;
}
.canSeeText{
  color:#2d8cf0;
  cursor: pointer;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width:100%;
}
.excel .ivu-upload-list{
    display:none!important;
}
</style>